<!--
  一个小圆点组件
  指定type属性来改变小圆点的颜色
-->

<template>
  <div :class="`point ${type}`" />
</template>

<script>

export default {
	name: "BigPoint",
	props: {
		type: {
			required: true,
			type: String,
		}
	}
}
</script>

<style scoped>
.point {
	width: 10px;
	height: 10px;
	margin-left: 10px;
  border-radius: 50%;
}

.danger {
  background: #F56C6C;
}

.warn {
	background: #E6A23C;
}

.success {
	background: #00CC66;
}

.lost {
	background: #909399;
}

</style>
